<template>
  <slot :tableData="tableData" :sortState="sortState" :onSort="onSort"></slot>
</template>

<script setup lang="ts">
import { SortBy, TableV2SortOrder } from "element-plus";
import { computed, ref } from "vue";
import type { ITableRow } from "./type";

const props = defineProps<{
  tableData: ITableRow[];
}>();

const sortState = ref<SortBy>({
  key: "count",
  order: TableV2SortOrder.DESC,
});

const tableData = computed(() => {
  // const res = props.tableData.sort((a, b) => {
  //   if (sortState.value.order === TableV2SortOrder.ASC) {
  //     return a.count - b.count;
  //   }
  //   return b.count - a.count;
  // });
  return props.tableData;
});

const onSort = (sortBy: SortBy) => {
  sortState.value = sortBy;
};
</script>
